<template>
  <!-- 分页区域 -->
  <el-pagination
    :current-page="queryInfo.pagenum"
    :page-sizes="pageSizes"
    :page-size="queryInfo.pagesize"
    layout="total, sizes, prev, pager, next, jumper"
    :total="total"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
  />
</template>

<script>
export default {
  props: {
    queryInfo: { type: Object, required: true },
    pageSizes: { type: Array, required: true },
    total: { type: Number, required: true }
  },
  emits: ['pageChanged'],
  methods: {
    pageChanged() {
      this.$emit('pageChanged')
    },
    handleSizeChange(newPageSize) {
      this.queryInfo.pagesize = newPageSize
      this.pageChanged()
    },
    handleCurrentChange(newPageNum) {
      this.queryInfo.pagenum = newPageNum
      this.pageChanged()
    }
  }
}
</script>

<style scoped>

</style>
